<template>
  <div class="alumniInformation">
    <!-- 头部背景 -->
	<div class="header_img">
		<image src="../../static/index/xiaoqing_bj.png" style="width: 100%;height: 100%;"></image>
	</div>
    <!-- <div class="head_box"></div> -->
    <!-- 活动列表 -->
    <div class="" style="padding: 10px">
      <div
        class="activeList"
        v-for="item in activeList"
        :key="item.id"
        @click="goDetails(item)"
      >
        <div class="timeStr">
          {{ item.timeStr }}
        </div>
        <div class="content">
          <div class="left">
            <div class="left_p1" style="margin-bottom: 10px">
              <u--text size="17" :text="item.title"></u--text>
            </div>
            <div class="left_p2">
              <div class="p1">阅读<span>2.6</span>万</div>
              <div class="p1">赞<span>517</span></div>
              <div class="p1"><span>28</span>个朋友读过</div>
            </div>
          </div>
          <div class="right">
            <u--image
              :showLoading="true"
              :src="item.img"
              width="57px"
              height="58px"
            ></u--image>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      activeList: [
        {
          id: 1,
          title: "活动报名|校友桌游俱乐部，这个周日不宅家，一起来玩剧本杀",
          address: "深圳市南山区平山一路附近",
          img: require("@/static/index/login_bj.png"),
          timeStr: "星期五",
        },
        {
          id: 2,
          title: "活动报名|校友户外俱乐部，人间何处寻瀑布，马峦山上齐共赏",
          address: "马峦山",
          img: "https://cdn.uviewui.com/uview/album/1.jpg",
          timeStr: "星期五",
        },
        {
          id: 3,
          title: "活动报名|校友摄影俱乐部11月户外实践",
          address: "深圳市福田区深业上城",
          img: require("@/static/index/login_bj.png"),
          timeStr: "星期五",
        },
        {
          id: 4,
          title: "香港校友会|冬日囤“肉”盼友归，多肉绿植制作活动",
          address: "深圳巿深圳市龙井地铁站附近",
          img: require("@/static/index/login_bj.png"),
          timeStr: "星期五",
        },
      ],
    };
  },
  methods: {
    goDetails(item) {
      // uni.navigateTo({
      //   url: `/pages/alumniActivities/activeDetails?id=${item.id}`,
      // });
    },
  },
  onLoad(){
	  this.$apis.informationList().then((res) => {
	  	console.log(res)
	  		if(res.success){
	  			// let shuju = res.result
	  			// this.activeList=res.result
	  		}
	  		
	  })
  }
};
</script>
<style lang="scss" scoped>
.alumniInformation {
	.header_img {
		height: 120px;
	}
  // .head_box {
  //   height: 100px;
  //   background: url(../../static/index/xiaoqing_bj.png) no-repeat center/100%
  //     100%;
  // }
}
//活动列表
.activeList {
  background: white;
  margin-bottom: 10px;
  padding: 10px 15px;
  border-radius: 10px;
  padding-bottom: 15px;
  .timeStr {
    color: #b5b5b5;
  }
  .content {
    width: 100%;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
    margin-top: 15px;
    .left {
      width: 80%;
      .left_p2 {
        display: flex;
        font-size: 13px;
        color: #cccccc;
        .p1 {
          margin-right: 6px;
        }
      }
    }
    .right {
      width: 20%;
      display: flex;
      flex-direction: column;
      align-items: center;
      .state {
        border: 1px solid #999999;
        padding: 3px 10px;
        font-size: 12px;
        text-align: center;
        display: inline-block;
        margin-top: 10px;
        border-radius: 3px;
        color: #999999;
      }
    }
  }
}
</style>